<template>
    <div>
        <el-card class="box-card">
            <div slot="header" class="clearfix">
                <span>门店组详情</span>
                <el-button style="float: right; padding: 3px 0" type="text" @click="goBack">返回</el-button>
            </div>
            <el-descriptions title="" direction="vertical" :column="9" border size="small">
                <el-descriptions-item label="助记名称">
                    {{ qrcodeGroupInfo.name }}
                </el-descriptions-item>
                <el-descriptions-item label="距离限制">
                    {{ qrcodeGroupInfo.distanceLimit }}
                </el-descriptions-item>
                <el-descriptions-item label="提示信息">
                    {{ qrcodeGroupInfo.message }}
                </el-descriptions-item>
            </el-descriptions>
        </el-card>
        <el-divider></el-divider>
        <el-card class="box-card">
            <div slot="header" class="clearfix">
                <span>关联门店</span>
            </div>
            <work-qrcode-shop :work-corp-id="qrcodeGroupInfo.workCorpId" :qrcode-group-id="id" size="small"></work-qrcode-shop>
        </el-card>
    </div>
</template>

<script>
import {getWorkQrcodeGroupById} from '@/api/api'
import WorkQrcodeShop from "@/component/workwx/WorkQrcodeShop";

export default {
    name: "WorkQrcodeGroupDetail",
    components: {WorkQrcodeShop},
    data() {
        return {
            // 门店组ID
            id: '',
            // 组合码信息
            qrcodeGroupInfo: {},
        }
    },
    methods: {
        // 获取表格数据
        getData: function () {
            getWorkQrcodeGroupById({id: this.id}).then(data => {
                this.qrcodeGroupInfo = data.body;
            });
        },
        goBack() {
            // 编程式导航
            this.$router.go(-1);
        },
    },
    created() {
        this.id = this.$route.query.id;
        this.getData();
    }
}
</script>

<style scoped>
.el-input {
    width: 150px !important;
}

.el-select {
    width: 150px !important;
}
</style>
